<!-- 项目分佣比例明细查看 -->
<template>
	<div class="subcommissionDetailSee">
		<el-breadcrumb separator="/" class="bread-title">
			<el-breadcrumb-item :to="{ path: '/subcommissionDetail'}">项目分佣比例明细</el-breadcrumb-item>
			<el-breadcrumb-item>查看</el-breadcrumb-item>
		</el-breadcrumb>

		<el-table :data="tableData" border style="width: 70%">
			<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
			<el-table-column label="生效时间"  width="310" prop="createTime" :formatter="timerhander" align="center"></el-table-column>
			<el-table-column 
			    v-for="(col,idx) in headerlist"
			    :prop="String(col.businessLineId)" :key="idx" :label="col.businessLineName" :formatter="businesshander">
			</el-table-column>
			<el-table-column label="操作人" prop="updatorName" align="center"></el-table-column>
		</el-table>
		<div class="pagebar">
		  <el-pagination
		    background
		    layout="total, sizes, prev, pager, next"
		    :current-page.sync="pageNum"
		    :page-sizes="[10, 20, 30, 40]"
		    :page-size="pageSize"
		    @size-change="handleSizeChange"
		    @current-change="handleCurrentChange"
		    :total="totalSize">
		  </el-pagination>
		</div>

	</div>
</template>
<script>
    import api from '@/api/apiPath'
	export default {
		data () {
			return {
				pageNum: 0,
				pageSize: 10,
				totalSize:0,
				tableData:[],
				headerlist:[],//动态列表头
				ruleForm:{
					devId:undefined,
					pageNum: 0,
					pageSize: 10,
					ascFlag:false
				},
			}
		},
		methods:{
			handleCurrentChange(){
				this.getlist()
			},
			handleSizeChange(val){
				this.pageSize = val
				this.getlist();
			},
			getlist(){
				this.axios.post(api.PROJECTSETTINGDETAIL,this.ruleForm).then((res) => {
					if (res.data.code == 200) {
				        this.tableData = res.data.data.pageInfo.list
				        this.headerlist = res.data.data.headerList
				        this.totalSize = res.data.data.pageInfo.total
					}
				})
			},
			timerhander(row, column, cellValue, inde){
				return row.createTime+' — '+ row.updateTime
			},
			businesshander(row, column, cellValue, index){
				if (cellValue.length>0) {
					let str =""
					cellValue.forEach(item=>{
						str += item.staffName+': '+item.proportion+'\n'
					})
					return str
				}else {
					return '———'
				}
			}
		},
		created(){
			this.ruleForm.devId = this.$route.query.devId;
			this.getlist()
		}
	}
	

</script>


<style lang="stylus">
	.subcommissionDetailSee{
		.el-table .cell {
			text-align: center;
			white-space: pre-line;/*保留换行符*/
		}
	}

</style>